﻿<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="DHTML_template.aspx.vb" Inherits="TestRTE.DHTML_template" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--Данный файл является обычной ASPX-версией будущего Web-control-а Invoteco.Web.RichTextBox
и служит для оценки работоспособности клиентского кода (javascript и др.) в условиях их работы
на aspx-странице.

10.12.2010  Добавлен скрипт id="tabmanipulation" для организации переключения закладок с сохранением состояния в Cookie
 -->
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<style type="text/css">
     .activetab{width:16.7%; border-left: solid 1px black; border-top:solid 1px black; border-right:solid 1px black; border-bottom: none 1px black;}
     .inactivetab{width:16.7%; border-left: dotted 1px black; border-top:dotted 1px black; border-right:dotted 1px black; border-bottom: solid 1px black;}
     .inactiverow{ display:none;}
     .activerow{ display:block;}
</style>
    <title>DHTML Template</title>
        <script type="text/javascript">
            //ЭТО ПЕРЕРАБОТАННЫЙ ИСХОДНЫЙ СКРИПТ ДЛЯ ПРОСТЕЙШЕГО WYSIWYG. Служит для обеспечения работоспособности
            //HTML-шаблона

            //Флаг браузера
            var isGecko;
            var tiframe;
            var tiWin;
            var tiDoc;

            //Общая функция для определения браузера
            function getbrowser() {
                isGecko = navigator.userAgent.toLowerCase().indexOf("gecko") != -1;
                tiframe = (isGecko) ? document.getElementById("tframeId") : frames["tframeId"];
                tiWin = (isGecko) ? tiframe.contentWindow : tiframe.window;
                tiDoc = (isGecko) ? tiframe.contentDocument : tiframe.document;

                if (!tiDoc.designMode) alert("Визуальный режим редактирования не поддерживается Вашим браузером");
                else tiDoc.designMode = (isGecko) ? "on" : "On";

            }

            function templateScript() {
                var newHTML = "<iframe scrolling='no' frameborder='no' src='#' id='tframeId' name='tframeId'width='100%' height='100%'></iframe><br/>";
                document.getElementById('framecell').innerHTML = newHTML;
                getbrowser();
                // Иначе не работает в Mozilla
                tiDoc.open(); tiDoc.write(); tiDoc.close();
                if (!tiDoc.designMode) {
                    alert("Визуальный режим редактирования не поддерживается Вашим браузером");
                } else { tiDoc.designMode = (isGecko) ? "on" : "On"; }
                tiWin.focus();
            }
            /*ФУНКЦИИ ДЛЯ ОБЕСПЕЧЕНИЯ РАБОТЫ КНОПОК ПАНЕЛИ GENERAL (Сохранить, Печать, Новый, Открыть, Копировать,
            Вырезать, Вставить, Отмена последнего действия, Возврат к последнему действию, Обновить, Вызов справки)*/

            //Копирование выделенного в буфер обмена TODO: Не работает в Mozilla
            //Есть вариант сделать так, чтобы кнопка Copy не отображалась, если Браузер Mozilla,
            //т.к в Mozilla эта функция корректно работает при  применении контектстного меню.
            //Однако лучше найти выход как реализовать эту функцию в Mozilla
            function copy() {
                tiWin.document.execCommand("Copy", false, null);
            }

            //Сохранение содержимого TODO: Не работает в Mozilla. См. Примечание к функции copy()
            //В IE8 работает  корректно, причем сохраняет и текс и рисунки (смайлы)
            function doSaveAs() {
                if (tiWin.document.execCommand) {
                    tiWin.document.execCommand("SaveAs", false, "Test.html");
                } else {
                    alert('This command is available in Internet Explorer only.');
                }
            }
            //Печать документа TODO: Не работает в Mozilla. См. Примечание к функции copy()
            function print() {
                tiWin.document.execCommand("Print", true, null);
            }

            //Открыть
            function open() {
                //tiWin.document.execCommand("Open", false, null);
                tiWin.document.execCommand("Open");
            }

            //Обновление текщего документа TODO: Не работает в Mozilla. См. Примечание к функции copy()
            function refresh() {
                tiWin.document.execCommand("Refresh", false, null);
            }

            /*ФУНКЦИИ ДЛЯ ОБЕСПЕЧЕНИЯ РАБОТЫ КНОПОК ПАНЕЛИ TEXT*/
            //Для установки жирного текста
            function template_setBold() {
                tiWin.document.execCommand("bold", null, "");
            }
            //Для установки курсива
            function template_setItal() {
                tiWin.document.execCommand("italic", null, "");
            }
            //Для установки подчеркнутого текста
            function template_setUnder() {
                tiWin.document.execCommand("underline", null, "");
            }
            //Для вставки смайлов
            function template_setImage(url) {
                tiWin.focus(); //Необходимо для установки курсора после смайла сразу после вставки
                tiWin.document.execCommand("InsertImage", null, url);
            }
            //Для установки типа шрифта
            function ChangeFontName() {//переработано c aspalliance  
                var fontName = document.getElementById("fontname");
                tiWin.document.execCommand('FontName', false, fontName.options[fontName.selectedIndex].text);
            }

            //Для вставки ссылки
            function setLink() {
                var url = prompt("Введите URL:", "http://");
                if (!url) return;
                tiWin.document.execCommand("CreateLink", null, url);
            }

            //Для вставки произвольного HTML
            function setH1() {
                tiWin.focus();
                execCommandImitation("<h1 class='oranzh'>", "</h1>");
            }

            //Для отступа
            function setIndent() {
                tiWin.focus(); //Если убрать эту строку, то в IE8 функция работает только при условии полного выделения текста.
                tiWin.document.execCommand("Indent", false, 1);
            }

            //Для обратного отступа
            function setOutdent() {
                tiWin.focus(); //Если убрать эту строку, то в IE8 функция работает только при условии полного выделения текста.
                tiWin.document.execCommand("Outdent", false, 1);
            }

            //Для выравнивания по левому краю
            function justifyLeft() {
                tiWin.focus(); //Если убрать эту строку, то в IE8 функция работает только при условии полного выделения текста.
                tiWin.document.execCommand("JustifyLeft", false, null);
            }

            //Для выравнивания по центру
            function justifyCenter() {
                tiWin.focus(); //Если убрать эту строку, то в IE8 функция работает только при условии полного выделения текста.
                tiWin.document.execCommand("JustifyCenter", false, null);
            }

            //Для выравнивания по правому краю
            function justifyRight() {
                tiWin.focus(); //Если убрать эту строку, то в IE8 функция работает только при условии полного выделения текста.
                tiWin.document.execCommand("JustifyRight", false, null);
            }

            //Выровнять все
            function justifyFull() {
                tiWin.focus(); //Если убрать эту строку, то в IE8 функция работает только при условии полного выделения текста.
                tiWin.document.execCommand("JustifyFull", false, null);
            }

            //Отменить выравнивание TODO: Не работает в Mozilla 
            function justifyNone() {
                tiWin.focus(); //Если убрать эту строку, то в IE8 функция работает только при условии полного выделения текста.
                tiWin.document.execCommand("JustifyNone", false, null);
                JustifyNone
            }

            function insertParagraph() {
                tiWin.focus(); // TODO: Если закомментировать это, то работает в Mozilla но не работает в IE8 и наоборот
                tiWin.document.execCommand("InsertParagraph", false, null);
            }

            /*#####################  Блок кода для вставки произвольного HTML ##################################*/
            // ***********************
            // ШАГ 5: Форматирование произвольным HTML-контентом
            // ***********************
            // nodeList - формирует массив всех узлов с указанием степени их вложенности
            function nodeList(parentNode, list, level) {
                var i, node, count;
                if (!list) list = new Array();
                level++;
                for (i = 0; i < parentNode.childNodes.length; i++) {
                    node = parentNode.childNodes[i];
                    if (node.nodeType != 1) continue;
                    count = list.length;
                    list[count] = new Array();
                    list[count][0] = node;
                    list[count][1] = level;
                    nodeList(node, list, level);
                }
                return list;
            }
            // rgbNormal - приводит цвет к стандарту #RRGGBB
            function rgbNormal(color) {
                color = color.toString();
                var re = /rgb\((.*?)\)/i;
                if (re.test(color)) {
                    compose = RegExp.$1.split(",");
                    var hex = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];
                    var result = "#";
                    for (var i = 0; i < compose.length; i++) {
                        rgb = parseInt(compose[i]);
                        result += hex[parseInt(rgb / 16)] + hex[rgb % 16];
                    }
                    return result;
                } else { return color; }
            }

            function execCommandImitation(start, end) {
                // Cтавим ForeColor-форматирование с помощью специального цвета
                tiDoc.execCommand("ForeColor", false, "#f5F856");

                // tiWin.document.execCommand("ForeColor", false, "#f5F856");//Если раскомментировать эту строку, то тоже работает
                // Получаем все элементы форматируемого документа
                var allNodes = nodeList(tiDoc.body, false, 0);
                // Сортируем их по уровню вложенности
                var maxLevel = 0;
                for (i = 0; i < allNodes.length; i++) {
                    maxLevel = allNodes[i][1] > maxLevel ? allNodes[i][1] : maxLevel;
                }
                // 4. Для всех элементов заменяем FONT и SPAN со специальным цветом на переданный код
                var node, newnode, color, parent;
                for (j = maxLevel; j >= 1; j--) {
                    for (i = 0; i < allNodes.length; i++) {
                        if (allNodes[i][1] != j) continue;
                        node = allNodes[i][0];
                        sname = node.nodeName.toLowerCase();
                        color = node.color ? rgbNormal(node.color) : rgbNormal(node.style.color);
                        if (color) color = color.toLowerCase();
                        if (sname == "font" || sname == "span" && color == "#f5f856") {
                            try {
                                node.innerHTML = start + node.innerHTML + end;
                            } catch (e) { }
                            parent = node.parentNode;
                            while (node.childNodes.length > 0) parent.insertBefore(node.firstChild, node);
                            parent.removeChild(node);
                        }
                    }
                }
                tiWin.focus();
            }

            function setH1() {
                tiWin.focus();
                execCommandImitation("<h1 class='oranzh'>", "</h1>");
            }
    </script>
<script type="text/javascript" id="tabmanipulation">
    /*=========================== Блок для установки и смены состояния Tab-ов =============================*/
    var tabcount = 6; //Кол-во корешков
    //Функция для для преобразования СТРОКОВОГО  идентификатора объекта tab в ЧИСЛОВОЕ
    function stringIdTonumber(stringId) {
        return parseInt(stringId.charAt(3), 10);
    }

    //Функция для для преобразования ЧИСЛОВОГО идентификатора объекта tab в СТРОКОВОЕ 
    function numberIdToStringId(numberId) {
        return 'tab' + numberId.toString();
    }

    //Для получения состояния конкретного Tab-a
    function getTabState(sid) {
        var tab = (document.all) ? document.all(sid) : document.getElementById(sid);
        if (tab.className == "activetab") {
            return true;
        } else {
            return false;
        }
    }

    //Для установки состояния конкретного Tab-a
    function setTabState(sid, state) {
        var tab = (document.all) ? document.all(sid) : document.getElementById(sid);
        if (state == true) {
            tab.className = "activetab";
        } else {
            tab.className = "inactivetab";
        }
    }

    //Для смены состояния отображения
    function changeState(elemID) {
        var nid = stringIdTonumber(elemID);
        for (var i = 0; i < tabcount; i++) {
            if (i == nid) {
                setTabState(numberIdToStringId(i), true);
                //activetabindex = numberIdToStringId(i);
            } else {
                setTabState(numberIdToStringId(i), false);
            }
        }
        setRow(); //Установка отображаемых строк с кнопками
    }

    /*=========================== Конец блока для установки и смены состояния Tab-ов =============================*/

    /*===== Блок для установки и смены панелей (строк с кнопками) ====================*/
    //Установка отображения строки с кнопками (стиля dysplay='none')
    function setRow() {
        for (var i = 0; i < tabcount; i++) {
            var tab = (document.all) ? document.all('tab' + i.toString()) : document.getElementById('tab' + i.toString());
            if (tab.className == "inactivetab") {
                var row = (document.all) ? document.all('row_tab' + i.toString()) : document.getElementById('row_tab' + i.toString());
                row.className = "inactiverow";
            } else {
                var row = (document.all) ? document.all('row_tab' + i.toString()) : document.getElementById('row_tab' + i.toString());
                row.className = "activerow";
            }
        }
    }


    /*===================*/
    function IsCookieEnabled() {
        // проверяем существование свойства navigator.cookieEnabled
        if (typeof (navigator.cookieEnabled) != "undefined") {
            return navigator.cookieEnabled;
        } else {
            // если свойство navigator.cookieEnabled 
            // не поддерживается, то просто попробуем
            // установить и получить назад тестовый cookie
            var tmpCookie = "testCookieForCheck";
            SetCookie(tmpCookie, "1");
            if (GetCookie(tmpCookie) != null) {
                DeleteCookie(tmpCookie);
                return true;
            }
            //isCookieSupport = false;
            return false;
        }
    }

    function getCookie(name) {
        var cookie = " " + document.cookie;
        var search = " " + name + "=";
        var setStr = null;
        var offset = 0;
        var end = 0;
        if (cookie.length > 0) {
            offset = cookie.indexOf(search);
            if (offset != -1) {
                offset += search.length;
                end = cookie.indexOf(";", offset)
                if (end == -1) {
                    end = cookie.length;
                }
                setStr = unescape(cookie.substring(offset, end));
            }
        }
        return (setStr);
    }

    function setCookie(name, value, expires, path, domain, secure) {
        document.cookie = name + "=" + escape(value) +
            ((expires) ? "; expires=" + expires : "") +
            ((path) ? "; path=" + path : "") +
            ((domain) ? "; domain=" + domain : "") +
            ((secure) ? "; secure" : "");
    }

    function restoreState() {
        var isCookieSupport = false;
        isCookieSupport = IsCookieEnabled();
        if (isCookieSupport == true) {

            var c = getCookie('acttab');
            if ((c == "undefined") || (c == null)) {
                c = "tab0"
            } else {
                c = getCookie('acttab').toString();
            }
            setTabState(c, true)
            setRow();
        } else { alert('!!!'); }
    }
</script>
</head>
<body onload="templateScript(), IsCookieEnabled(), restoreState()">

        <div> HTML-шаблон. TabBar-вариант
        <br />
        <br />

            <table style="width: 100%;" cellpadding="0" cellspacing="0">
                <tr id="tabbarrow">
                    <td style="height:16px;">
                        <table id="tabtable" cellpadding="0" cellspacing="0" style="width: 100%;"  >
                            <tr id="tabrow">
                         <td id="tab0" align="center" 
                                    class="inactivetab" 
                                    onclick="changeState(this.id), setCookie('acttab', this.id)">Default tab</td>
                        <td id="tab1" align="center" 
                                    class="inactivetab" 
                                    onclick="changeState(this.id), setCookie('acttab', this.id)">Text tab</td>
                        <td id="tab2" align="center"  
                                    class="inactivetab" 
                                    onclick="changeState(this.id), setCookie('acttab', this.id)">Tables tab</td>
                        <td id="tab3" align="center" 
                                    class="inactivetab" 
                                    onclick="changeState(this.id), setCookie('acttab', this.id)">Smiles tab</td>
                        <td id="tab4" align="center" 
                                    class="inactivetab" 
                                    onclick="changeState(this.id), setCookie('acttab', this.id)">Images tab</td>
                        <td id="tab5" align="center" 
                                    class="inactivetab" 
                                    onclick="changeState(this.id), setCookie('acttab', this.id)">Media tab</td>   
                        </tr>
                        </table>
                    </td>
                </tr>
            
            <tr id="row_tab0">
                <td style="height:24px; border-left: solid 1px black; border-right:solid 1px black; border-bottom:solid 1px black;">
                    <input type="image" src="Images/FormatButtonImages/20_20/save.gif"  onclick="doSaveAs()"/>
                <input type="image" src="Images/FormatButtonImages/20_20/print.gif" onclick="print()" />
                <input type="image" src="Images/FormatButtonImages/20_20/new.gif" />
                <input type="image" src="Images/FormatButtonImages/20_20/open.gif" onclick="open()" />
                <input type="image" src="Images/FormatButtonImages/20_20/copy.gif" onclick="copy()" />
                <input type="image"  src="Images/FormatButtonImages/20_20/cut.gif" />
                <input type="image"  src="Images/FormatButtonImages/20_20/paste.gif" />
                <input type="image"  src="Images/FormatButtonImages/20_20/insertDate.gif" />
                <input type="image" src="Images/FormatButtonImages/20_20/undo.gif" />
                <input type="image" src="Images/FormatButtonImages/20_20/redo.gif"/>    
                <input type="image" src="Images/FormatButtonImages/20_20/refresh.gif" onclick="refresh()" />
                <input type="image" src="Images/FormatButtonImages/20_20/help.gif" />
                </td>
            </tr>
           
            <tr id="row_tab1">
                <td style="height:24px;border-left: solid 1px black; border-right:solid 1px black;border-bottom:solid 1px black;">
                    <input type="image"  src="Images/FormatButtonImages/20_20/pastetext.gif"/>
                    <!-- данные select для выбора типа шрифта взяты из D:\PAS\INVOTECO\Web\WebControls\FORUM\FORUMCOMPONENTS\RTE\CURRENT_VERSION\Invoteco.Web.RichTextEditor_160710_VS2008_1\TestRTE\freetextbox\richtext_compressed.js -->
                     <!-- <select id="fontname_' + rte.rteID + '" onchange="selectFont(\'' + rte.rteID + '\', this.id)"> -->
                      <select id="fontname" onchange="ChangeFontName()">
                        <option value="Font" selected="selected">[Font]</option>
                        <option value="Arial, Helvetica, sans-serif">Arial</option>
                        <option value="Courier New, Courier, mono">Courier New</option>
                        <option value="Times New Roman, Times, serif">Times New Roman</option>
                        <option value="Verdana, Arial, Helvetica, sans-serif">Verdana</option>
                        <option></option>
                    </select>
                    <input type="image"  src="Images/FormatButtonImages/20_20/bold.gif" onclick="template_setBold()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/italic.gif" onclick="template_setItal()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/under.gif" onclick="template_setUnder()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/left.gif" onclick="justifyLeft()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/center.gif" onclick="justifyCenter()"/>
                    <input type="image" src="Images/FormatButtonImages/20_20/justifyfull.gif" onclick="justifyFull()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/justifynone.gif" onclick ="justifyNone()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/right.gif" onclick="justifyRight()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/paragraph.gif" onclick="insertParagraph()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/indent.gif" onclick="setIndent()"/>
                    <input type="image" src="Images/FormatButtonImages/20_20/outdent.gif" onclick="setOutdent()"/>
                    <input type="image" src="Images/FormatButtonImages/20_20/bullist.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/fontcolor.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/lcase.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/ucase.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/link.gif" onclick="setLink()" />
                    <input type="image" src="Images/FormatButtonImages/20_20/rule.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/htmlview.gif" onclick="setH1()" />
                </td>
            </tr>
            
            <tr id="row_tab2">
                <td style="height:24px;border-left: solid 1px black; border-right:solid 1px black;border-bottom:solid 1px black;">
                    <input type="image"  src="Images/FormatButtonImages/20_20/border_bottom.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/border_left.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/border_none.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/border_outside.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/border_right.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/border_top.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/box.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/row.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/delrow.gif" />&nbsp;
                </td>
            </tr>
            
            <tr id="row_tab3">
                <td style="height:24px;border-left: solid 1px black; border-right:solid 1px black;border-bottom:solid 1px black;">
                    <input type="image" src="Images/SmileButtonImages/20_20/face1.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face2.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face3.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face4.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face5.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face6.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face7.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face8.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face9.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face10.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face11.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face12.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face13.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face14.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face15.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face16.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face17.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face18.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face19.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face20.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face21.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face22.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face23.gif" onclick="template_setImage(this.src);" />
                    <input type="image" src="Images/SmileButtonImages/20_20/face24.gif" onclick="template_setImage(this.src);" />
                </td>
            </tr>

            <tr id="row_tab4">
                <td style="height:24px;border-left: solid 1px black; border-right:solid 1px black;border-bottom:solid 1px black;">
                    <input type="image"  src="Images/FormatButtonImages/20_20/image.gif" />
                    <input type="image"  src="Images/FormatButtonImages/20_20/eximage.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/resize.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/forward.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/backward.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/zoom_in.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/zoom_out.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/Actualsize.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/bestfit.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/imageeditor.gif" />
                </td>
            </tr>
            
            <tr id="row_tab5">
                <td style="height:24px;border-left: solid 1px black; border-right:solid 1px black;border-bottom:solid 1px black;">
                    <input type="image"  src="Images/FormatButtonImages/20_20/media.gif" />
                    <input type="image"  src="Images/FormatButtonImages/20_20/avi.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/swf.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/wav.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/au.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/Actualsize.gif" />
                    <input type="image" src="Images/FormatButtonImages/20_20/bestfit.gif" />
                </td>
            </tr>
            
            <tr id="Tr7">
                <td id="framecell" style="height:100px; border-left: solid 1px black; border-right:solid 1px black;border-bottom:solid 1px black;"></td>
            </tr>
           
            <tr>
                <td style="height:10px; background-color:Silver;"></td>
            </tr>
        </table>

        
        </div>


    <form id="form1" runat="server">
    <div>
    
    </div> 
    <!-- Это кнопка для организации PostBack -->
    <asp:Button ID="Button1" runat="server" Text="Send" />
    </form>
</body>
</html>
